<template>
  <div class="wrapper">
    <div class="borders qwrapper" v-for="(item,index) in content" :key="index">
      <div class="points p1" v-if="questiontype && !item.getAnswer">{{item.questionPoint}}</div>
      <div class="points p2" v-if="questiontype && item.getAnswer">已采纳</div>
      <div class="otherwrapper">{{item.memberName}}</div>
      <div class="content" @click="toreply(item)">{{item.content}}</div>
      <div class="date">{{item.date}}</div>
    </div>
  </div>
</template>

<script>
// import axios from 'axios'
export default {
  name: 'question',
  data () {
    return {
    }
  },
  props: ['questiontype', 'content'],
  methods: {
    toreply (item) {
      let qid = ''
      let type = ''
      console.log(this.content)
      console.log(this.questiontype)

      if (this.questiontype) {
        qid = item.questionNo
        type = 1
      } else {
        qid = item.messageNo
        type = 2
      }
      console.log(qid)
      this.$router.push({
        name: 'reply',
        query: { qid, type }
      })
    }
  },
  mounted () {
    console.log(this.content)
  }
}
</script>
<style scoped>
.wrapper {
  width: 98%;
  height: auto;
  padding: 10px;
}
.otherwrapper {
  width: 100%;
  height: 40px;
  line-height: 40px;
  font-size: 14px;
  font-weight: 600;
}
.content {
  width: 100%;
  height: auto;
  max-height: 40px;
  line-height: 20px;
  font-size: 14px;
  text-align: justify;
  display: -webkit-box; /** 将对象作为伸缩盒子模型显示 **/
  -webkit-box-orient: vertical; /** 设置或检索伸缩盒对象的子元素的排列方式 **/
  -webkit-line-clamp: 2; /** 显示的行数 **/
  overflow: hidden; /** 隐藏超出的内容 **/
  cursor: pointer;
}
.date {
  width: 100%;
  height: 25px;
  line-height: 25px;
  text-align: right;
  margin-top: 10px;
}
.qwrapper {
  overflow: hidden;
  position: relative;
}
.points {
  position: absolute;
  top: -20px;
  right: -30px;
  transform: rotate(30deg);
  width: 120px;
  height: 50px;
  color: #fff;
  text-align: center;
  line-height: 80px;
}
.p1{
  background: #f20d0d;
}
.p2{
  background: rgba(0, 255, 0, .5);
}
</style>
